<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css"
href="../EXT4/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css"
href="../css/style.css" />
<script type="text/javascript" src="../EXT4/ext-all.js"></script>
<script type="text/javascript" src="../script/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
var pageSize = 10;

var required = '<span style="color:red;font-weight:bold" data-qtip="Required">*</span>';

window.onresize = function(){
    setTimeout(function(){panel.setWidth(Ext.getDom("signuppayment").width);},100);
};

Ext.onReady(function() {
	Ext.QuickTips.init();

	Ext.define('Payment', { 
        extend: 'Ext.data.Model', 
        fields: ['id','oaStudents','contractId','number',
        'payables','createUser','disbursements','method',{
        	name:'payTime',
        	convert: function(v, record) {
        		return v.substring(0,10);
        	}
        }] 
    });
    
	Ext.define('Method',{
		extend: 'Ext.data.Model', 
		idProperty : 'value',
		fields:['name','id']
	});
	
	var pay_type_store = Ext.create('Ext.data.Store', {
	    model: 'Method',
	    data   : [
	        {name : '现金',   value: '1'},
	        {name : '转账',  value: '2'},
	        {name : '刷卡', value: '3'}
	    ]
	});	
	
    var payment_store = Ext.create('Ext.data.Store', {
		model: 'Payment', 
		autoLoad: true,
		pageSize: pageSize,
		proxy: { 
	        type: 'ajax', 
	        url: '../service/payment_allpay',
	        method: 'POST',
	        reader: { 
	            type: 'json', 
	            root: 'pays',
	            total: 'total'
	        }
		}
	});
	
	var query = Ext.create('Ext.form.FieldSet',{
        title: '查询条件',
        collapsible: true,
        defaultType: 'textfield',
        layout: 'hbox',
        items :[{
            fieldLabel: '合同号:',
            labelWidth:40,
            id: 'query',
            width:200,
            margin:'0 10 0 0',
        }]
    });
    
    Ext.define('Student', { 
        extend: 'Ext.data.Model', 
        fields: ['id','displayName','createUserId'] 
    });                    
	var student_store = Ext.create('Ext.data.Store', {
		model: 'Student', 
		autoLoad: true,
		pageSize: pageSize,
		proxy: { 
            type: 'ajax', 
            url: '../service/student_allstu',
            method: 'POST',
            reader: { 
                type: 'json', 
                root: 'root',
                total: 'total'
            }
    	}
	});
	
	var m_student = Ext.create('Ext.selection.CheckboxModel',{
		checkOnly:true,
		mode: 'SINGLE',
		showHeaderCheckbox: false
	});
    
    var studentid = Ext.create('Ext.form.field.Text',{
    	hidden: true,
    	name: 'studentid',
    	id: 'studentid'
    });
    
    var studentname = Ext.create('Ext.form.field.ComboBox',{
    	fieldLabel: '付款学生',
    	multiSelect: false,
	    displayField: 'displayName',
	    store: student_store,
    	id: 'studentname',
    	labelWidth:70,
    	listeners: {
	    	select: function(comb, records) {
	    		studentid.setValue(records[0].data.id);
	    	}
	    }
    	
    });
    
    var payment_form = Ext.create('Ext.form.Panel',{
	    id: 'payment_form',
	    frame: true,
	    layout: 'vbox',
	    items:[{
	    	xtype: 'container',
	    	layout: 'hbox',
	    	align: 'stretch',
	    	defaults: {
	    		xtype: 'textfield',
	    		labelWidth:70,
	    		margin: '0 20 0 0'
	    	},
	    	items:[{
	    		hidden: true,
	        	name: 'payment.id',
	        	id: 'id',
	        },{
	        	fieldLabel: '流水号',
	        	name: 'payment.number',
	        	id: 'number',
	        	afterLabelTextTpl: required,
				allowBlank: false,
	        },{
	        	fieldLabel: '应付',
	        	name: 'payment.payables',
	        	id: 'payables',
	        	afterLabelTextTpl: required,
				allowBlank: false,
	        },{
	        	fieldLabel: '实付',
	        	name: 'payment.disbursements',
	        	id: 'disbursements',
	        	afterLabelTextTpl: required,
				allowBlank: false,
	        }]
	    },{
	    	xtype: 'container',
	    	layout: 'hbox',
	    	align: 'stretch',
	    	margin: '10 0 0 0',
	    	defaults: {
	    		xtype: 'textfield',
	    		labelWidth:70,
	    		margin: '0 20 0 0'
	    	},
	    	items:[{
	    		xtype: 'combo',
	        	fieldLabel: '付款方式',
	        	displayField: 'name',
				valueField: 'value',
				queryMode: 'local',
				store: pay_type_store,
	        	name: 'payment.method',
	        	id: 'method',
	        	afterLabelTextTpl: required,
				allowBlank: false,
	        },{
	        	xtype: 'datefield',
	        	format: 'Y-m-d',
	        	fieldLabel: '付款时间',
	        	name: 'payment.payTime',
	        	id: 'payTime',
	        	afterLabelTextTpl: required,
				allowBlank: false,
	        },studentname,studentid]
	    }],
	    buttons:[{
	    	xtype: 'button',
	    	text: '确定',
	    	handler: function() {			
				Ext.getCmp('payment_form').submit({
					url:'../service/student_updatepay',
	            	method: 'POST',
	    			success:function(form, action) {
	    				payment_form.getForm().reset();
	    				payment_store.load();
	    				edit_win.close();
	    			},failure:function(form, action) {
	    				Ext.Msg.alert('提示',action.result.msg);
	    			}
				});
			}
	    }]
    });
    
    var edit_win = Ext.create('Ext.window.Window',{
    	modal:true,
    	title: '修改信息',
    	resizable: false,
    	closeAction: 'hide',
    	items:[payment_form]
    });
	
	
	var content = Ext.create('Ext.grid.Panel',{
		id:'payment_grid',
		tbar: [{
			xtype:'button',
			text:'查询',
			handler: function() {
				var query = Ext.getCmp('query').getValue();
				query = escape(query);
				payment_store.loadPage(1,{ params:{'query':query} });
			}
		}],
		columns:[{
			text: '流水号',  dataIndex: 'number',width:'12%'
		},{
			text: '应付',  dataIndex: 'payables',width:'8%'
		},{
			text: '实付',  dataIndex: 'disbursements',width:'5%'
		},{
			text: '付款方式',  dataIndex: 'method',width:'5%',
			renderer: function(value, meta) {
				if(value==1) return "现金";
				else if(value==2) return "转账";
				else if(value==3) return "刷卡";
				else return value;
			}
		},{
			text: '付款时间',  dataIndex: 'payTime',width:'12%'
		},{
			text: '办理老师',  dataIndex: 'createUser',width:'12%',
			renderer: function(value, meta) {
				return value.displayName;
			}
		},{
			text: '学生姓名',  dataIndex: 'oaStudents',width:'7%',
			renderer : function(value, meta){
				if(value[0] == undefined || value[0].displayName == undefined) return '';
				return '<b>'+value[0].displayName+'</b>';
			},
			listeners:{
				dblclick: function(view, html, raw, col) {
					var student = view.getStore().getAt(raw).get('oaStudents')[0];
				
					var detail = '';
					
					detail += '电话：'+ student.displayName +'<br/>';
					detail += '年级：'+ student.grade +'<br/>';
					detail += '紧急联系人：'+ student.emergency +'<br/>';
					detail +=  '紧急联系电话：' + student.EPhone;
					
					var tip = Ext.create('Ext.tip.ToolTip', {
						target: html,
						trackMouse: true,
						title: student.displayName,
					    html: detail
					});
					
					tip.show();
					
				}
			}
					
		},{
			xtype: 'actioncolumn',
				text: '操作',
				width:'15%',
				items: [{
					icon: '../EXT4/fam/cog_edit.png"',
					handler: function(grid, rowIndex, colIndex) {
						var rec = payment_store.getAt(rowIndex);
						
						payment_form.getForm().reset();
						
						edit_win.show();
						
						payment_form.loadRecord(rec);
						if(rec.data.oaStudents[0] != undefined) {
							payment_form.queryById('studentid').setValue(rec.data.oaStudents[0].id);
							studentname.select(rec.data.oaStudents[0].displayName);
						}
						payment_form.queryById('method').setValue(pay_type_store.findRecord('value',rec.data.method));
						
					}
				}]
		}],
		dockedItems: [{ 
			xtype: 'pagingtoolbar', 
			store: payment_store,
			dock: 'bottom', 
			displayInfo: true 
         }],
		store:payment_store
	});
	
	panel=Ext.create('Ext.Panel', {
        id:'main-panel',
        baseCls:'x-plain',
        renderTo:'signuppayment',
        items:[query,content]
	});
	
});
</script>
</head>
<body>
	<div id="signuppayment"></div>
</body>
</html>